<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>云API</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../css/style.css"/>
    <link rel="stylesheet" href="../css/main.css">
    <link rel="stylesheet" href="../css/aui.css">
  <style>
  #container{
      background-color: white;
  }
  </style>
</head>
<body>
<div id="container"></div>
<div id="no"></div>
<!--
  <li>
    <div class="aui-timeline">
            <div class="aui-timeline-item-header">2017年1月8日</div>

            <div class="aui-timeline-item">
                <div class="aui-timeline-item-inner">
                    <div class="aui-card-list">
                        <div class="aui-card-list-header aui-border-b">更好的组合模式</div>
                        <div class="aui-card-list-content-padded">
                            <div class="aui-row aui-row-padded">
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo1.png" />
                                </div>
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo2.png" />
                                </div>
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo3.png" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</li>



  <li>
    <div class="aui-timeline">
            <div class="aui-timeline-item-header">2017年1月8日</div>

            <div class="aui-timeline-item">

                <div class="aui-timeline-item-inner">
                    <div class="aui-card-list">
                        <div class="aui-card-list-header aui-border-b">更好的组合模式</div>
                        <div class="aui-card-list-content-padded">
                            <div class="aui-row aui-row-padded">
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo1.png" />
                                </div>
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo2.png" />
                                </div>
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo3.png" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</li>



  <li>
    <div class="aui-timeline">
            <div class="aui-timeline-item-header">2017年1月8日</div>

            <div class="aui-timeline-item">

                <div class="aui-timeline-item-inner">
                    <div class="aui-card-list">
                        <div class="aui-card-list-header aui-border-b">更好的组合模式</div>
                        <div class="aui-card-list-content-padded">
                            <div class="aui-row aui-row-padded">
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo1.png" />
                                </div>
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo2.png" />
                                </div>
                                <div class="aui-col-xs-4">
                                    <img src="../image/demo3.png" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</li> -->


</div>
</body>
<script type="text/javascript" src="../script/zepto.min.js"></script>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/urlAddress.js"></script>

<script type="text/javascript">

var paramObj = new Object();
var pageSize = 10;
var pageNum = 1;
paramObj.pageSize = pageSize;
paramObj.pageNum = pageNum;

apiready = function(){
   initRefresh();
   addEventListener();
}


  /**
  *方法描述：上啦刷新
  */
  var  initRefresh = function () {
        api.setRefreshHeaderInfo({
            visible: true,
            loadingImg: 'widget://image/refresh.png',
            bgColor: '#ccc',
            textColor: '#fff',
            textDown: '下拉刷新...',
            textUp: '松开刷新...',
            showTime: true
       }, function(ret, err) {
         pageNum = 1;
         paramObj.pageNum = pageNum;
          main.init(true);
           api.refreshHeaderLoadDone();
       });

   }


  /**
  *方法描述：添加下拉加载
  */
   var addEventListener = function () {
       api.addEventListener({
           name: 'scrolltobottom',
           extra:{
              threshold:"50px"
                  }
       }, function(ret, err){
         pageNum+=1;
         paramObj.pageNum = pageNum;
           main.init(false);
       });

   }

/**
*方法描述：页面跳转
*
*/



var main = {
  init:function (bol) {
    $.ajax({
      url:URL+"edit/getTimsgList",
      type:"post",
      dataType:"json",
      data:paramObj,
      success:function (data) {
                  var result = eval("("+data+")");
                  if(result.msg==0){
                      var val = result.val;

                      if(val.total==0){
                          $("#no").html('  <div class="aui-card-list-footer aui-text-center aui-border-t">暂无数据</div>')
                      }else{
                        main.addData(val.rows,$("#container"),bol)
                        if(pageNum*pageSize>=val.total){
                              $("#no").html('<div class="aui-card-list-footer aui-text-center aui-border-t">没有更多数据了</div>')
                        }else{
                            $("#no").empty();
                        }
                      }



                  }else{

                  }
            }


    })
  },
  /*
  *方法描述：添加数据
  */
  addData:function (data,container,bol) {

      if(!data || !container) return ;
      var html = "";
      for(var i = 0,len =data.length;i<len;i++){
                html+='<div class="aui-timeline" data-id="'+data[i].id+'" onclick="main.getTimsgInfo('+data[i].id+')">' +
                            '<div class="aui-timeline-item-header" style="float:">'+main.replaceDate(data[i].date) +'</div>' +
                            '<div class="aui-timeline-item">' +
                                // '<div class="aui-timeline-item-label aui-bg-warning text-light">NO.'+(data[i].id)+'</div>' +
                                '<div class="aui-timeline-item-inner">' +
                                    '<div class="aui-card-list">' +
                                        '<div class="aui-card-list-header aui-border-b">'+data[i].place+'</div>' +
                                        '<div class="aui-card-list-content-padded">' +
                                            '<div class="aui-row aui-row-padded">' +
                                                '<div class="aui-col-xs-4">' +
                                                    '<img src="'+data[i].imgFront+'" />' +
                                                '</div>' +
                                                '<div class="aui-col-xs-4">' +
                                                    '<img src="'+data[i].imgBack+'" />' +
                                                '</div>' +
                                            '</div>' +
                                        '</div>' +
                                    '</div>' +
                                '</div>' +
                            '</div>' +
                '</div>'

      }
      bol?container.html(html):container.append(html);

  },
  getTimsgInfo:function(id){
      api.openWin({
          name: 'timsgInfo_win',
          url: './timsgInfo_win.html',
          pageParam: {
              id: id
          }
      });

  },
  replaceDate:function (date) {
      if(!date) return false;
      var result = date = new Date(date);
       result = result.getFullYear()+"-"+(result.getMonth()+1)+"-"+result.getDate();
      return result;
  }

}

var init = function () {
      main.init();//数据初始化

}


$(function () {
    init();
})





</script>
</html>
